import React, { Fragment } from "react";

// import loadable from "@loadable/component";
// import Loading from "./Loading.js";

import {
  HashRouter as Router,
  Routes,
  Route,
  Redirect
} from "react-router-dom";

// components

import ShoppingList from "./home.jsx";
import PeopleCom from "./people.jsx";

// 子路由
import ShopDetail from "./shopDetail.jsx";

/**
 * 
 * react-router-dom v6
 * 
 * 
*/


// loading 
// const LoadableComponent = loadable(() => import("./Dashboard.js"), {
  // fallback: <Loading />
// });

const HomeClass=()=>{
  return (
    <Router>
    <Routes>
    <Route 
    exact 
    path="/shop"
    element={<ShoppingList />}
    >
      {/* 子路由 */}
    <Route
    path="detail"
    element={<ShopDetail />}
    ></Route>
    </Route>

    <Route 
    exact 
    path="/people"
    element={<PeopleCom />}
    >
    </Route>
    </Routes>
    </Router>
  );
}


 export default HomeClass;
